<template>
	<view>
		<view class="page-body">
			<view class="page-section page-section-gap">
				<map style="width: 100%; height: 300px" :iconPath="iconPath" :scale="12" :latitude="latitude" :longitude="longitude" :markers="covers"></map>
			</view>
		</view>
		<image v-if="collectShow" class="imgCollect" src="../../static/yishoucang.png" mode="" @click="collect"></image>
		<image v-else class="imgCollect" src="../../static/shoucang.png" mode="" @click="collect"></image>

		<button @click="goSpot(latitude, longitude)">查看广告解锁</button>
		<!-- <button @click="save">保存</button> -->
		<view class="fish">
			<view class="opts" @click="report">
				<image class="image" src="../../static/jubao.png" mode=""></image>
				<view class="txt">钓点举报</view>
			</view>
			<view class="opts" @click="onskip('/pages/index/enter')">
				<image class="image" src="../../static/daren.png" mode=""></image>
				<view class="txt">达人入住</view>
			</view>
			<view class="opts">
				<image class="image" src="../../static/fengsiqun.png" mode=""></image>
				<view class="txt">加粉丝群</view>
			</view>
		</view>
		<!-- <view class="fishSpot" v-if="show">
			<view>将搜钓点一键添加至桌面</view>
			<view class="add">添加</view>
			<image class="imgBack" @click="back" src="../../static/guanbi.png" mode=""></image>
		</view> -->
	</view>
</template>

<script>
export default {
	data() {
		return {
			collectShow: false,
			show: true,
			radio1: 0, //举报类型
			locat: '请选择钓点位置',
			spotName: '',
			keyword: '', //搜索框的输入值
			id: 0, // 使用 marker点击事件 需要填写id
			idd: 0, //钓点id
			title: 'map',
			latitude: 30.66,
			longitude: 104.1,
			// iconPath: '/static/weizhi.png',
			covers: [
				{
					id: 1,
					title: '李家沱234234',
					latitude: 30.68,
					longitude: 104.1,
					// iconPath: '/static/weizhi.png',
					label: '你好'
				},
				{
					id: 2,
					title: '钩钩果',
					latitude: 30.68,
					longitude: 104.08,
					// iconPath: '/static/weizhi.png',
					label: '你好'
					// width:20,
					// height:24,
				}
			],
			rewardedVideoAd: '', //广告id
			newObj: {} //传递来的参数对象
		};
	},
	onLoad(opt) {
		let obj = JSON.parse(decodeURIComponent(opt.obj));
		if(obj.guanggaokaiguan  == 0){
			uni.navigateTo({
				url: '/pages/newPages/returnSpot?obj=' + encodeURIComponent(JSON.stringify(obj))
			});
		}
		if(obj.shifoushouchang == 1){
			this.collectShow = false
		}
		this.newObj = obj;
		this.idd = obj.id;
		this.latitude = Number(obj.lat);
		this.longitude = Number(obj.lon);
		console.log('opt222', obj, opt);
		this.rewardedVideoAd = uni.createRewardedVideoAd({ adUnitId: 'oslzwywbf2qdcxqg53' });
	},
	methods: {
		report() {
			uni.navigateTo({
				url: '/pages/newPages/report?id=' + this.idd
			});
		},
		// 查看广告
		goSpot(lat, lon) {
			this.rewardedVideoAd.show().catch(() => {
				this.rewardedVideoAd
					.load()
					.then(() => this.rewardedVideoAd.show())
					.catch((err) => {
						uni.showToast({
							icon: 'none',
							position: 'bottom',
							title: '视频拉取失败，请稍后再试！'
						});
						return;
					});
			});
			this.rewardedVideoAd.onLoad(() => {
				console.log('onLoad event');
				// 当激励视频被关闭时，默认预载下一条数据，加载完成时仍然触发 `onLoad` 事件
			});
			this.rewardedVideoAd.onError((err) => {
				console.log('onError event', err);
			});
			this.rewardedVideoAd.onClose((res) => {
				// 用户点击了【关闭广告】按钮
				if (res && res.isEnded) {
					// 正常播放结束
					uni.navigateTo({
						url: '/pages/newPages/returnSpot?obj=' + encodeURIComponent(JSON.stringify(this.newObj))
					});
					console.log('正常播放广告结束111', res,this.newObj);
				} else {
					// 播放中途退出
					console.log('中途播放广告结束111');
				}
			});
		},
		haha(e) {
			console.log(e);
		},

		back() {
			this.show = false;
		},
		collect() {
			console.log('click收藏')
			this.$api.post('my/collect', { id: this.idd }).then((res) => {});
			if (this.collectShow) {
				uni.showToast({
					title: '取消收藏',
					icon: 'fail',
					duration: 1000
				});
				this.collectShow = !this.collectShow;
			} else {
				uni.showToast({
					title: '已收藏',
					icon: 'success',
					duration: 1000
				});
				this.collectShow = !this.collectShow;
			}
		}
	}
};
</script>

<style lang="scss">
.fishSpot {
	display: flex;
	justify-content: space-around;
	width: 700rpx;
	height: 107rpx;
	// background: #F5F5F5;
	margin: 0 27rpx;
	background: #000000;
	border-radius: 20rpx;
	opacity: 0.7;
	font-weight: 500;
	font-size: 29rpx;
	color: #ffffff;
	line-height: 107rpx;
	position: fixed;
	bottom: 100rpx;
}
.imgBack {
	width: 21rpx;
	height: 21rpx;
	margin-top: 43rpx;
}
.add {
	width: 107rpx;
	height: 53rpx;
	background: #3681f3;
	border-radius: 13rpx;
	text-align: center;
	line-height: 53rpx;
	margin-top: 30rpx;
}
.fish {
	display: flex;
	justify-content: space-around;
	text-align: center;
	margin: 37rpx 27rpx;
	background: #ffffff;
	border-radius: 20rpx;
	padding: 27rpx;
}
.image {
	width: 47rpx;
	height: 47rpx;
}
.txt {
	font-weight: 500;
	font-size: 24rpx;
	color: #333333;
	line-height: 32rpx;
}
.imgCollect {
	width: 100rpx;
	height: 100rpx;
	position: fixed;
	top: 400rpx;
	right: 50rpx;
}
button {
	height: 87rpx;
	line-height: 87rpx;
	font-family: PingFang SC;
	font-weight: 500;
	font-size: 24rpx;
	color: #333333;
	margin: 40rpx 27rpx 0;
	background: #3681f3;
	border-radius: 13rpx;
	font-weight: 500;
	font-size: 29rpx;
	color: #ffffff;
}
</style>
